*{
	font-family: Helvetica,Arial,sans-serif;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	list-style-type:none;
	
}

body{
	background-color:#E5E4E3;
	background-image: url("/img/f2.jpeg");
	 background-size: 100%;
	 background-origin: content
  	background-position: center;
  	background-repeat: no-repeat;
	
}
a:hover{text-decoration:none;}


a
{text-decoration:none;
	color:#FFFFFF;
}
leyend{
	color:#FBFBFB;
	
}
#header{
		padding:0px;
		margin:auto;
		width:500px;
		font-family:Arial, Helvetica, sans-serif;
		}
	
	ul, ol{
		list-style: none;
		}
	.nav li{
		margin:0px,0px,0px,25px;
	}
	.nav li a
	{
		padding:10px;
		background-color:#1E1E1E;
		color:#FFFFFF;
		text-decoration:none;
		display:block;
		font-size: 20px;
				
	}
	.nav li a:hover{
		background-color:#434343;
		
	}
	.nav >li {
		float:left;
		
	}
	.nav li ul{
		display:none;
		position:absolute;
	
	}
	.nav li:hover > ul{
		display:block;
			
	}
	.nav li ul li{
		position:relative;
	}
	.nav li ul li {
		width:280px;
		top 0px;
	}




#contenedor{
	width: auto;
	height: auto;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	background-color: transparent;
	overflow: hidden;
}


#notificaciones{
	width: 100%;
	height: 50px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	
	
	
background: #1E1E1E;	
	
	
}

#notificaciones p{
	width: 500px;
	height: 40px;
	margin: 10px 0px 0px 15px;
	padding: 0px;
	color:white;
	float: left;
	font-size: 20px;
}
#notificaciones menu-sig{
	background:#2D8864;
	padding:12px;
	
	
}

.bloque{
	width: 50px;
	height: 50px;
	float: right;
}

/************************************************************************/

/* cuadro celeste : area de notificacion de usuario para foto y sesion */
#notificacion-usuario{
	background-color: #4285F4;
	width: 175px;
	height: 50px;
	overflow: hidden;
}

#notificacion-usuario-foto{
	border-radius: 20px;
	width: 43px;
	height: 43px;
	margin-left:5px;
	margin-top: 3px;
	float: left;
	box-shadow: 1px 1px 5px black;
}

#notificacion-usuario-foto img{ /* declaramos que la imagen se invoque al tamaño de la capa*/
	border-radius: 20px;
	width: 43px;
	height: 43px;
}

#notificacion-usuario-datos{
	width: 125px;
	height: 50px;
	margin: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	background-color: transparent;
	float: left;
}

#notificacion-usuario-datos-saludo{
	width: 125px;
	height: 25px;
	background-color: transparent;
	margin-top: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

#notificacion-usuario-datos-saludo p{
	width: 125px;
	height: 25px;
	color: white;
	font-weight: bold;
	font-size: 13px;
	float: left;
	text-align: center;
	margin-left: 0px;
	margin-top: 5px;
}

#notificacion-usuario-datos-nombre{
	width: 125px;
	height: 25px;
	background-color: transparent;
	margin-top: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

#notificacion-usuario-datos-nombre p{
	width: 125px;
	height: 25px;
	color: white;
	font-weight: bold;
	font-size: 11px;
	float: left;
	text-align: center;
	margin-left: 0px;
	margin-top: -2px;
}

/*************************************************************/

/* cuadro verde : area de notificaciones de existencia de solicitudes para peritajes */
#notificacion-peritaje{
	/*background-color: #2D8864;*/
	background: #2D8864 url("../img/icon_17393.svg") no-repeat center center;
	background-size: 28px 28px;
}

#notificacion-peritaje:hover{
	/*background-color: #2D8864;*/
	background: #2D8864 url("../img/icon_17393.svg") no-repeat center center;
	background-size: 32px 32px;
}

#notificacion-peritaje-aviso{
	background-color: #82AF6F;
	border-radius: 20px;
	width: 20px;
	height: 20px;
	margin-left: 26px;
	margin-top: 15px;
}

#notificacion-peritaje-aviso p {
	background-color: transparent;
	color: white;
	width: 20px;
	height: 20px;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	margin: 3px 10px 0px 0px;
}

/****************************************************************/

/* cuadro morado : area de para otras notificaciones */

#notificacion-otros{
	/*background-color: #882D64;*/
	background: #882D64 url("../img/icon_8581.svg") no-repeat center center;
	background-size: 32px 32px;
}

#notificacion-otros:hover{
	/*background-color: #882D64;*/
	background: #882D64 url("../img/icon_8581.svg") no-repeat center center;
	background-size: 36px 36px;
}

#notificacion-otros-aviso{
	background-color: #D15B47;
	border-radius: 20px;
	width: 20px;
	height: 20px;
	margin-left: 26px;
	margin-top: 15px;
}

#notificacion-otros-aviso p {
	background-color: transparent;
	color: white;
	width: 20px;
	height: 20px;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	margin: 3px 10px 0px 0px;
}

/******************************************************************/

#titulo{
	width: 100%;
	height: 5px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	background-color: #428DB8;
}

#cuerpo{

	width: 100%;
	height: auto;
	margin: 75px 0px 0px 0px;
	padding: 0px;
	overflow: hidden;
}

#titulo-login{
	width: 50%;
	height: 100px;
	margin: 50px auto 0px auto;
	padding: 0px 0px -600px 0px;

}

#titulo-login img{
	width: 800px;
	height: 175px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}


#contenido{
	width:100%;	
	height: auto;  /* cambiarlo a auto para que cresca con el tamaño de los formularios */
	margin: auto;
	padding: 10px;
	float:left;
	overflow: hidden;
}
#parametros{
	background-color:rgba(255,255,255,0.8);
	height:85px;
	width:100%;
}
fieldset{
	font-size: 25px;
}
#tabla-p{
	margin:auto;
	text:center;
	width:80%;
}
#f1{

float:left
width:60%;

}
#f2{

float:right;
width:40%;

}

footer{
	width: 100%;
	height: 50px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	background-color: black;
	clear: both;
}

.reporte{
	background-color:rgba(255,255,255,1);
	 margin: 0 auto;
	 padding:auto;
	 
	
}
.reporte tabla{
background-color: #0000FF;
}


/*Para los formularios de ingreso*/


/
/*	 CODIGO PARA LOS BLOQUES A CARGAR COMO FORMULARIOS */

/*********************************************************************************************/
/* NO BORRAR ESTOS COLORES NI MOVERLOS DEL FINAL DEL ARCHIVO*/

/*background-color: #428DB8;    color celeste oscuro

/*background-color: #61A7D0;    color celeste claro

/*

    celeste claro 
	
	background: #e0f3fa;
	background: -moz-linear-gradient(top,  #e0f3fa 0%, #d8f0fc 50%, #b8e2f6 51%, #b6dffd 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e0f3fa), color-stop(50%,#d8f0fc), color-stop(51%,#b8e2f6), color-stop(100%,#b6dffd));
	background: -webkit-linear-gradient(top,  #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	background: -o-linear-gradient(top,  #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	background: -ms-linear-gradient(top,  #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	background: linear-gradient(to bottom,  #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0f3fa', endColorstr='#b6dffd',GradientType=0 );
	
	celesto oscuro para hover

    background: #6db3f2;
	background: -moz-linear-gradient(top,  #6db3f2 0%, #54a3ee 50%, #3690f0 51%, #1e69de 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6db3f2), color-stop(50%,#54a3ee), color-stop(51%,#3690f0), color-stop(100%,#1e69de));
	background: -webkit-linear-gradient(top,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%);
	background: -o-linear-gradient(top,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%);
	background: -ms-linear-gradient(top,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%);
	background: linear-gradient(to bottom,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2', endColorstr='#1e69de',GradientType=0 );
	
	/* color verde

	background: rgb(210,255,82); 
	background: -moz-linear-gradient(top,  rgba(210,255,82,1) 0%, rgba(145,232,66,1) 100%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(210,255,82,1)), color-stop(100%,rgba(145,232,66,1))); 
	background: -webkit-linear-gradient(top,  rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); 
	background: -o-linear-gradient(top,  rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); 
	background: -ms-linear-gradient(top,  rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); 
	background: linear-gradient(to bottom,  rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#91e842',GradientType=0 );




*/
/**********************************************************************************************/



.modalmask {
    position: fixed;
    font-family: Arial, sans-serif;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,0.8);
    z-index: 99999;
    opacity:0;
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
    pointer-events: none;
}
.modalmask:target {
    opacity:1;
    pointer-events: auto;
}

.modalbox{
    width: 400px;
    position: relative;
    padding: 5px 20px 13px 20px;
    background: #fff;
    border-radius:3px;
    -webkit-transition: all 500ms ease-in;
    -moz-transition: all 500ms ease-in;
    transition: all 500ms ease-in;
     
}	
.movedown {
    margin: 0 auto;
}
.rotate {
    margin: 10% auto;
    -webkit-transform: scale(-5,-5);
    transform: scale(-5,-5);
}
.resize {
    margin: 10% auto;
    width:0;
    height:0;
 
}
.modalmask:target .movedown{       
    margin:10% auto;
}
.modalmask:target .rotate{     
    transform: rotate(360deg) scale(1,1);
        -webkit-transform: rotate(360deg) scale(1,1);
}
 
.modalmask:target .resize{
    width:400px;
    height:200px;
}

.close {
    background: #606061;
    color: #FFFFFF;
    line-height: 25px;
    position: absolute;
    right: 1px;
    text-align: center;
    top: 1px;
    width: 24px;
    text-decoration: none;
    font-weight: bold;
    border-radius:3px;
 
}
 
.close:hover {
    background: #FAAC58;
    color:#222;
}
